<script setup>
import {onMounted, ref} from "vue";
import {Line} from "@antv/g2plot";
import axios from "axios";

const data = ref([])

const loadData = async () => {
  await axios({
    method: "get",
    url: "http://127.0.0.1:8888/zdppy_amg2plot_line"
  }).then(resp => {
    if (resp.data && resp.data.data && resp.data.data.results) {
      data.value = resp.data.data.results
    }
  })
}

onMounted(async () => {

  fetch('https://gw.alipayobjects.com/os/bmw-prod/1d565782-dde4-4bb6-8946-ea6a38ccf184.json')
      .then((res) => res.json())
      .then((data) => {
        const line = new Line('container', {
          data,
          padding: 'auto',
          xField: 'Date',
          yField: 'scales',
          xAxis: {
            // type: 'timeCat',
            tickCount: 5,
          },
        });

        line.render();
      });
})
</script>

<template>
  <div id="container"></div>
</template>

<style scoped>

</style>